<template>
	<view class="content upde-info">
		<view class="input-group">
			<view class="input-row border">
				<label class="title"><span class="i-color">* </span>电话:</label>
				<input type="text" class="input-text uni-view" v-model="userData.code" disabled="true"></input>
			</view>
			<view class="input-row border">
				<label class="title"><span class="i-color">* </span>姓名:</label>
				<input type="text" class="input-text uni-input uni-view" v-model="userData.userName" placeholder="请输入姓名"></input>
			</view>
			<view class="input-row border">
				<text class="title"><span class="i-color">* </span>身份证正面:</text>
				<view class="uni-uploader" style="padding:15upx;">
					<view class="img-box-wrapper">
						<view class="img-box" v-if="userData.idCardPositive">
							<image class="img" :src="host+'/core/file/download/'+userData.idCardPositive||''" @click="clickImg(host+'/core/file/download/'+userData.idCardPositive)"></image>
							<view class="icon-box" @click="deleteImg(1)">
								<icon type="clear" size="26" />
							</view>
						</view>
						<view v-else class="uni-uploader__input-box" @tap="chooseImage(1)"></view>
					</view>
				</view>
			</view>
			<view class="input-row border">
				<text class="title"><span class="i-color">* </span>身份证反面:</text>
				<view class="uni-uploader" style="padding:15upx;">
					<view class="img-box-wrapper">
						<view class="img-box" v-if="userData.idCardOpposite">
							<image class="img" :src="host+'/core/file/download/'+userData.idCardOpposite||''" @click="clickImg(host+'/core/file/download/'+userData.idCardOpposite)"></image>
							<view class="icon-box" @click="deleteImg(0)">
								<icon type="clear" size="26"/>
							</view>
						</view>
						<view v-else class="uni-uploader__input-box" @tap="chooseImage(0)"></view>
					</view>
				</view>
			</view>
		</view>
		<view class="btn-row">
			<button type="primary" class="primary" @tap="update">修改个人资料</button>
			<button type="button" class="primary" @tap="updatePwd">修改密码</button>
		</view>
	</view>
</template>

<style lang="scss">
	.upde-info{
		.input-row.border:last-of-type::after{
			height: 0;
		}
		.uni-radio-wrapper{
			.uni-radio-input{
				width: 40upx;
				height: 40upx;
			}
		}
		.picker-item{
			flex: 1;
			.uni-view{
				text-align: left;
			}
		}
	}
	.input-row{		
		.uni-view{
			&.placehold-view{
				color: #808080;
			}
		}
		.radio-group{
			flex: 1;
		}
		.input-text{
			flex: 1;
			min-height: 40upx;
			height: 40upx;
			line-height: 40upx;
			font-size: 28upx;
			padding: 20upx 0;
		}
		.textarea-text {
			flex: 1;
			border: 1px solid #B2B2B2;
			margin: 10upx 10upx 10upx 16upx;
			padding: 10upx;
			font-size: 28upx;
			line-height: 40upx;
			height: 200upx;
		}
	}
	uni-input, uni-input input{
		min-height: 80upx;
	}
	.radio-group {
		height: 40upx;
		.radio{
			margin-right: 20upx;
		}
	}
	
	.img-box-wrapper{
		.img-box {
			width: 160upx;
			height: 160upx;
			position: relative;
			font-size: 0;
			margin: 0 20upx 20upx 0;
			.img {
				width: 160upx;
				height: 160upx;
			}
			.icon-box {
				position: absolute;
				right: 0;
				top: 0;
				transform: translate(50%, -50%);
				background: #fff;
				border-radius: 50%;
				icon {
					float: left;
				}
			}
		}
	}
</style>

<script>
	import api from '../../api.js';
	var util = require('../../common/util.js');

	export default {
		components: {
		},
		data() {
			return {
				host:api.HOST,
				themeColor: '#007AFF',
				userData: uni.getStorageSync('user'),
				registerText: ''
			}
		},
		onLoad: function(e) {
			
		},
		methods: {
			//选择身份证
			chooseImage(type) {
				let _this = this;
				util.imgHandle.chooseImage(1,['compressed'],['album', 'camera']).then(function(res) {
					uni.showLoading({
						title: '上传中',
						mask:true
					});
					api.uploadFile({
						url:'core/file/uploadAttachment.json',
						filePath: res,
						name: 'file',
						success: (data) => {
							uni.hideLoading();
							if(data.code==0){
								if(type){
									_this.userData.idCardPositive = data.data.id;
								}else{
									_this.userData.idCardOpposite = data.data.id;
								}
							}else{
								uni.showToast({
									icon: 'none',
									title: '上传失败，请重新上传'
								});
							}
						},
						fail() {
							uni.showToast({
								icon: 'none',
								title: '上传失败，请重新上传'
							});
						}
					})
					return util.imgHandle.saveImageToPhotosAlbum(res); //保存到本地相册
				})
			},
			// 预览图片
			clickImg(item) {
				util.imgHandle.previewImage(item);
			},
			// 删除图片
			deleteImg(type) {
				if(type){
					this.userData.idCardPositive = '';
				}else{
					this.userData.idCardOpposite = '';
				}
			},
			updatePwd() {
				uni.navigateTo({
					url:"/pages/profile/updatePwd"
				})
			},
			// 修改
			update() {
								
				if (this.userData.userName.length < 2) {
					uni.showToast({
						icon: 'none',
						title: '姓名至少为 2 个字符'
					});
					return;
				}
				api.post({
					url: 'api/userUpdate.do',
					data: this.userData,
					success(res) {
						if(res.data.length>6){
								uni.showModal({
								content: res.data,
								confirmText: "确定",
								cancelText: "取消"
							})
							return
						}
						uni.showToast({
							icon: 'none',
							title: res.data,
						});
						var userInfo = uni.getStorageSync('user');
						const data = {
						    id: userInfo.user.id,
						};
						api.post({
							url:'api/getInfo.do',
							data:data,
							success(res) {
								if(res.isSuccess){
									uni.showToast({
									    icon: 'none',
									    title: '修改成功！'
									});
									uni.setStorageSync('user',res.data)
									
								}else{
									uni.showToast({
									    icon: 'none',
									    title: res.data,
									});
								}
							}
						})
// 						uni.redirectTo({
// 							 url: '../user/info'
// 						});
// 						uni.reLaunch({
// 							   url: '../user/main',
// 						});
						uni.navigateBack({
							delta: 1
						})
					}
				})
			}
		}
	}
</script>
